<template>
  <section>
    <van-sticky>
      <PageHeader title="基本资料"/>
    </van-sticky>

    <van-cell-group title="个人信息" v-if="member">
      <div class="pd10 text-center">
        <van-uploader :before-read="beforeUploadRead" :after-read="afterUploadRead">
          <img :src="user.auditing_avatar_url" class="user-avatar" v-if="user.avatar_audit_status == USER_AVATAR_AUDIT_STATUS_AUDITING" />
          <img :src="user.avatar_url ? user.avatar_url : STATIC_BASE_URL + 'images/mp/gender.png'" class="user-avatar" v-else />
        </van-uploader>
        <p class="text-center font-common" v-if="user.avatar_audit_status == USER_AVATAR_AUDIT_STATUS_AUDITING">(审核中)</p>
      </div>

      <van-cell title="昵称" :value="user.nick" is-link @click="nickFormVisible=true"/>
      <van-cell title="性别"
                :value="member.gender>0 ? member.gender_str : ''"
                label="一旦设定则不可更改"
                :isLink="member.gender == 0 ? true : false"
                @click="showGenderSheet"/>
      <van-cell title="生日" value="" is-link label="一旦设定则不可更改" @click="birthdayCalendarVisible=true"
                v-if="member.birthday == 0"/>
      <van-cell title="生日" :value="member.birthday|timeFormat('yyyy-MM-dd')" v-else/>
      <van-cell title="微信号" :value="member.wxid" is-link @click="showWxidFormDialogVisible"/>
      <van-cell title="所在地" :value="member.live_city_str" is-link @click="onShowRegionPopup('live')"/>
      <van-cell title="户籍地" :value="member.birth_city_str" is-link @click="onShowRegionPopup('birth')"/>
      <van-cell title="婚姻状况" :value="member.marriage_status_str" is-link @click="marriageStatusSheetVisible=true"/>
      <van-cell title="身高" :value="member.height > 0 ? member.height + 'cm' : ''" is-link
                @click="heightSheetVisible=true"/>
      <van-cell title="体重" :value="member.weight > 0 ? member.weight + 'KG' : ''" is-link
                @click="weightSheetVisible=true"/>
      <van-cell title="学历" :value="member.education > 0 ? member.education_str : ''" is-link
                @click="educationTypesSheetVisible=true"/>
      <van-cell title="毕业院校" :value="member.graduate_institutions" is-link
                @click="graduateInstitutionsFormDialogVisible=true"/>
      <van-cell title="职业" :value="member.job > 0 ? member.job_str : ''" is-link @click="jobsSheetVisible=true"/>
      <van-cell title="单位性质" :value="member.job_type > 0 ? member.job_type_str : ''" is-link
                @click="jobTypesVisible=true"/>
      <van-cell title="年收入" :value="member.annual_income > 0 ? member.annual_income_str : ''" is-link
                @click="incomesSheetVisible=true"/>
      <van-cell title="房产"
                :value="member.house_status > 0 ? member.house_status_str + '('+member.house_location_str+')' : ''"
                is-link @click="$router.push({name: 'MyProfileHouseStatus'})"/>
      <van-cell title="车子" :value="member.car_status > 0 ? member.car_status_str : ''" is-link
                @click="carStatusSheetVisible=true"/>
      <van-cell title="小孩情况" :value="member.kids > 0 ? member.kids_str : ''" is-link @click="kidsSheetVisible=true"/>
      <van-cell title="血型" :value="member.blood_type > 0 ? member.blood_type_str : ''" is-link
                @click="bloodTypesSheetVisible=true"/>
      <van-cell title="民族" :value="member.nation > 0 ? member.nation_str : ''" is-link
                @click="nationsSheetVisible=true"/>
    </van-cell-group>

    <van-cell-group title="个人&家庭" v-if="member">
      <van-cell title="宗教信仰" :value="member.faith > 0 ? member.faith_str : ''" is-link
                @click="faithsSheetVisible=true"/>
      <van-cell title="吸烟" :value="member.smoke_status > 0 ? member.smoke_status_str : ''" is-link
                @click="smokesSheetVisible=true"/>
      <van-cell title="喝酒" :value="member.drink_status > 0 ? member.drink_status_str : ''" is-link
                @click="drinksSheetVisible=true"/>
      <!--      <van-cell title="家中排行" :value="member.blood_type > 0 ? member.blood_type_str : ''" is-link />-->
    </van-cell-group>

    <van-cell-group title="婚姻规划" v-if="member">
      <van-cell title="异地恋" :value="member.distance_relationship_type > 0 ? member.distance_relationship_type_str : ''"
                is-link @click="distanceRelationshipTypesVisible=true"/>
      <van-cell title="是否要小孩" :value="member.child_type > 0 ? member.child_type_str : ''" is-link
                @click="childTypesVisible=true"/>
      <van-cell title="愿与对方父母同住" :value="member.live_parents_type > 0 ? member.live_parents_type_str : ''" is-link
                @click="liveParentsTypesVisible=true"/>
    </van-cell-group>

    <div class="empty-box"></div>

    <van-action-sheet
      v-model="genderSheetVisible"
      :actions="genderActions"
      cancel-text="取消"
      description="性别"
      close-on-click-action
      @select="onGenderActionsSelect"
    />

    <van-calendar
      v-model="birthdayCalendarVisible"
      :min-date="minBirthDate"
      :max-date="maxBirthDate"
      :default-date="defaultBirthDate"
      @confirm="onBirthdayCalendarConfirm"/>

    <van-dialog v-model="wxidFormDialogVisible" title="微信号" show-cancel-button @confirm="onWxidFormDialogConfirm"
                @cancel="onWxidFormDialogCancel">
      <van-field v-model="formData.wxid" label="微信号" placeholder="请输入常用的微信号"/>
    </van-dialog>

    <van-dialog v-model="graduateInstitutionsFormDialogVisible" title="毕业院校" show-cancel-button
                @confirm="onGraduateInstitutionsFormDialogConfirm" @cancel="onGraduateInstitutionsFormDialogCancel">
      <van-field v-model="formData.graduate_institutions" label="院校" placeholder="请输入毕业院校名称"/>
    </van-dialog>

    <van-popup v-model="showRegionPopup" round position="bottom">
      <van-cascader
        v-model="selectedRegions"
        title="请选择所在地区"
        :options="provinceList"
        @close="showRegionPopup = false"
        @change="onRegionCascaderChange"
        @finish="onRegionCascaderFinish"
      />
    </van-popup>

    <van-action-sheet
      v-model="marriageStatusSheetVisible"
      :actions="marriageStatusActions"
      cancel-text="取消"
      description="婚姻状况"
      close-on-click-action
      @select="onMarriageStatusActionsSelect"
    />

    <van-action-sheet
      v-model="heightSheetVisible"
      :actions="heightActions"
      cancel-text="取消"
      description="身高"
      close-on-click-action
      @select="onHeightActionsSelect"
    />

    <van-action-sheet
      v-model="weightSheetVisible"
      :actions="weightActions"
      cancel-text="取消"
      description="体重"
      close-on-click-action
      @select="onWeightActionsSelect"
    />

    <van-action-sheet
      v-model="educationTypesSheetVisible"
      :actions="educationTypesActions"
      cancel-text="取消"
      description="学历"
      close-on-click-action
      @select="onEducationTypesActionsSelect"
    />

    <van-action-sheet
      v-model="jobsSheetVisible"
      :actions="jobsActions"
      cancel-text="取消"
      description="职业"
      close-on-click-action
      @select="onJobActionsSelect"
    />

    <van-action-sheet
      v-model="incomesSheetVisible"
      :actions="incomesActions"
      cancel-text="取消"
      description="年收入"
      close-on-click-action
      @select="onIncomesActionsSelect"
    />

    <van-action-sheet
      v-model="carStatusSheetVisible"
      :actions="carStatusActions"
      cancel-text="取消"
      description="购车情况"
      close-on-click-action
      @select="onCarStatusActionsSelect"
    />

    <van-action-sheet
      v-model="kidsSheetVisible"
      :actions="kidsActions"
      cancel-text="取消"
      description="孩子情况"
      close-on-click-action
      @select="onKidsActionsSelect"
    />

    <van-action-sheet
      v-model="bloodTypesSheetVisible"
      :actions="bloodTypesActions"
      cancel-text="取消"
      description="血型"
      close-on-click-action
      @select="onBloodTypeActionsSelect"
    />

    <van-action-sheet
      v-model="nationsSheetVisible"
      :actions="nationsActions"
      cancel-text="取消"
      description="民族"
      close-on-click-action
      @select="onNationsActionsSelect"
    />

    <van-action-sheet
      v-model="faithsSheetVisible"
      :actions="faithsActions"
      cancel-text="取消"
      description="宗教信仰"
      close-on-click-action
      @select="onFaithsActionsSelect"
    />

    <van-action-sheet
      v-model="smokesSheetVisible"
      :actions="smokesActions"
      cancel-text="取消"
      description="吸烟"
      close-on-click-action
      @select="onSmokesActionsSelect"
    />

    <van-action-sheet
      v-model="drinksSheetVisible"
      :actions="drinksActions"
      cancel-text="取消"
      description="喝酒"
      close-on-click-action
      @select="onDrinksActionsSelect"
    />

    <van-action-sheet
      v-model="jobTypesVisible"
      :actions="jobTypesActions"
      cancel-text="取消"
      description="单位性质"
      close-on-click-action
      @select="onJobTypesActionsSelect"
    />

    <van-action-sheet
      v-model="distanceRelationshipTypesVisible"
      :actions="distanceRelationshipTypesActions"
      cancel-text="取消"
      description="异地恋"
      close-on-click-action
      @select="onDistanceRelationshipTypesActionsSelect"
    />

    <van-action-sheet
      v-model="childTypesVisible"
      :actions="childTypesActions"
      cancel-text="取消"
      description="要小孩"
      close-on-click-action
      @select="onChildTypesActionsSelect"
    />

    <van-action-sheet
      v-model="liveParentsTypesVisible"
      :actions="liveParentsTypesActions"
      cancel-text="取消"
      description="与对方父母同住"
      close-on-click-action
      @select="onLiveParentsTypesActionsSelect"
    />

    <van-dialog v-model="nickFormVisible" title="修改昵称" show-cancel-button @confirm="saveMemberNick">
      <form action="/">
        <van-field
          v-model="nickForm.nick"
          name="nick"
          label="昵称"
          placeholder="请输入昵称"
        />
      </form>
    </van-dialog>
  </section>
</template>

<script>
import {
  regionChildrenUri,
  memberSaveBaseInfoUri,
  memberConstantsUri,
  STATIC_BASE_URL,
  fileUploadByBase64Uri,
  memberModifyUserAvatarUri, memberModifyUserNickUri, memberMyProfileUri
} from "../../../common/api";
import {USER_AVATAR_AUDIT_STATUS_AUDITING} from '../../../common/constants';
import PageHeader from "../../componets/PageHeader";
import Vue from 'vue';
import {
  Sticky,
  Popup,
  RadioGroup,
  Radio,
  Checkbox,
  Button,
  Toast,
  Cell,
  CellGroup,
  ActionSheet,
  Calendar,
  Dialog
} from 'vant';

Vue.use(Sticky).use(Popup).use(RadioGroup).use(Radio).use(Checkbox).use(Button).use(CellGroup).use(Cell).use(ActionSheet).use(Calendar).use(Dialog);

export default {
  components: {
    PageHeader,
    [Dialog.Component.name]: Dialog.Component
  },
  data() {
    return {
      STATIC_BASE_URL: STATIC_BASE_URL,
      USER_AVATAR_AUDIT_STATUS_AUDITING: USER_AVATAR_AUDIT_STATUS_AUDITING,
      member: null,
      user: null,

      genderSheetVisible: false,
      genderActions: [],
      birthdayCalendarVisible: false,
      minBirthDate: new Date(1900, 0, 1),
      maxBirthDate: new Date(),
      defaultBirthDate: new Date(1986, 0, 1),
      wxidFormDialogVisible: false,
      graduateInstitutionsFormDialogVisible: false,
      formData: {
        wxid: '',
        graduate_institutions: ''
      },
      showRegionPopup: false,
      selectedRegions: '',
      provinceList: [],
      cityList: [],
      regionPopupType: '',
      marriageStatusSheetVisible: false,
      marriageStatusActions: [],
      heightSheetVisible: false,
      heightActions: [],
      weightSheetVisible: false,
      weightActions: [],
      educationTypesSheetVisible: false,
      educationTypesActions: [],
      jobsSheetVisible: false,
      jobsActions: [],
      incomesSheetVisible: false,
      incomesActions: [],
      carStatusSheetVisible: false,
      carStatusActions: [],
      kidsSheetVisible: false,
      kidsActions: [],
      bloodTypesSheetVisible: false,
      bloodTypesActions: [],
      nationsSheetVisible: false,
      nationsActions: [],
      faithsSheetVisible: false,
      faithsActions: [],
      smokesSheetVisible: false,
      smokesActions: [],
      drinksSheetVisible: false,
      drinksActions: [],
      jobTypesVisible: false,
      jobTypesActions: [],
      distanceRelationshipTypesVisible: false,
      distanceRelationshipTypesActions: [],
      childTypesVisible: false,
      childTypesActions: [],
      liveParentsTypesVisible: false,
      liveParentsTypesActions: [],
      nickFormVisible: false,
      nickForm: {
        nick: ''
      }
    }
  },
  methods: {
    beforeUploadRead(file) {
      if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
        this.toast('请上传 jpg/png 格式图片');
        return false;
      }
      return true;
    },
    afterUploadRead(file) {
      const that = this;
      that.$http.post(fileUploadByBase64Uri, {
        fileData: file.content,
        upload_token: that.GLOBAL.userInfo.upload_token
      }, {emulateJSON: true}).then(response => {
        let {msg, code, file_id, url} = response.body;
        if (code != 0) {
          that.toast.fail(msg);
        } else {
          that.saveMemberAvatar(url, file_id);
        }
      }, response => {
        that.toast.fail('发生错误');
      })
    },
    showGenderSheet() {
      if (this.member.gender == 0) {
        this.genderSheetVisible = true;
      }
    },
    onGenderActionsSelect(item) {
      // 默认情况下点击选项时不会自动收起
      // 可以通过 close-on-click-action 属性开启自动收起
      this.genderSheetVisible = false;
      this.member.gender = item.value;
      this.saveMemberProfile();
    },
    onMarriageStatusActionsSelect(item) {
      this.marriageStatusActions = false;
      this.member.marriage_status = item.value;
      this.saveMemberProfile();
    },
    onHeightActionsSelect(item) {
      this.heightSheetVisible = false;
      this.member.height = item.value;
      this.saveMemberProfile();
    },
    onWeightActionsSelect(item) {
      this.weightSheetVisible = false;
      this.member.weight = item.value;
      this.saveMemberProfile();
    },
    onEducationTypesActionsSelect(item) {
      this.educationTypesSheetVisible = false;
      this.member.education = item.value;
      this.saveMemberProfile();
    },
    onJobActionsSelect(item) {
      this.jobsSheetVisible = false;
      this.member.job = item.value;
      this.saveMemberProfile();
    },
    onIncomesActionsSelect(item) {
      this.incomesSheetVisible = false;
      this.member.annual_income = item.value;
      this.saveMemberProfile();
    },
    onCarStatusActionsSelect(item) {
      this.carStatusSheetVisible = false;
      this.member.car_status = item.value;
      this.saveMemberProfile();
    },
    onKidsActionsSelect(item) {
      this.kidsSheetVisible = false;
      this.member.kids = item.value;
      this.saveMemberProfile();
    },
    onBloodTypeActionsSelect(item) {
      this.bloodTypesSheetVisible = false;
      this.member.blood_type = item.value;
      this.saveMemberProfile();
    },
    onNationsActionsSelect(item) {
      this.nationsSheetVisible = false;
      this.member.nation = item.value;
      this.saveMemberProfile();
    },
    onFaithsActionsSelect(item) {
      this.faithsSheetVisible = false;
      this.member.faith = item.value;
      this.saveMemberProfile();
    },
    onSmokesActionsSelect(item) {
      this.smokesSheetVisible = false;
      this.member.smoke_status = item.value;
      this.saveMemberProfile();
    },
    onDrinksActionsSelect(item) {
      this.drinksSheetVisible = false;
      this.member.drink_status = item.value;
      this.saveMemberProfile();
    },
    onJobTypesActionsSelect(item) {
      this.jobsSheetVisible = false;
      this.member.job_type = item.value;
      this.saveMemberProfile();
    },
    onDistanceRelationshipTypesActionsSelect(item) {
      this.distanceRelationshipTypesVisible = false;
      this.member.distance_relationship_type = item.value;
      this.saveMemberProfile();
    },
    onChildTypesActionsSelect(item) {
      this.childTypesVisible = false;
      this.member.child_type = item.value;
      this.saveMemberProfile();
    },
    onLiveParentsTypesActionsSelect(item) {
      this.liveParentsTypesVisible = false;
      this.member.live_parents_type = item.value;
      this.saveMemberProfile();
    },
    onBirthdayCalendarConfirm(date) {
      this.birthdayCalendarVisible = false;
      this.member.birthday = date.getTime() / 1000;
      this.saveMemberProfile();
    },
    onWxidFormDialogConfirm() {
      if (this.formData.wxid.length == 0) {
        Toast('微信号不能为空');
        return;
      }
      this.member.wxid = this.formData.wxid;
      this.saveMemberProfile();
    },
    onWxidFormDialogCancel() {
      this.formData.wxid = '';
    },
    onGraduateInstitutionsFormDialogConfirm() {
      if (this.formData.graduate_institutions.length == 0) {
        Toast('请输入院校名称');
        return;
      }
      this.member.graduate_institutions = this.formData.graduate_institutions;
      this.saveMemberProfile();
    },
    onGraduateInstitutionsFormDialogCancel() {
      this.formData.graduate_institutions = '';
    },
    showWxidFormDialogVisible() {
      this.wxidFormDialogVisible = true;
    },
    getRegions(parentId, callback) {
      const that = this;
      const url = regionChildrenUri + '?parent_id=' + parentId;
      this.$http.get(url).then(response => {
        let {code, msg, data} = response.body
        if (code != 0) {
          Toast.fail(msg);
        } else {
          callback(data.regions);
        }
      }, response => {
        // error callback
      })
    },
    onRegionCascaderChange(option) {
      const tabIndex = option.tabIndex;
      const value = option.value;
      if (tabIndex == 0) {
        if (value > 0) {
          const provinceList = this.provinceList;
          let provinceIndex = 0;
          for (let i = 0; i < provinceList.length; i++) {
            if (value == provinceList[i].value) {
              provinceIndex = i;
              break;
            }
          }
          this.getRegions(value, (regions) => {
            let children = [];
            children.push({
              text: '不限',
              value: 0
            });
            for (let i = 0; i < regions.length; i++) {
              children.push({
                text: regions[i].region_name,
                value: regions[i].region_id
              })
            }
            let province = provinceList[provinceIndex];
            province.children = children;
            this.$set(provinceList, provinceIndex, province);
          })
        } else {
          let children = [];
          children.push({
            text: '不限',
            value: 0
          });
          const provinceList = this.provinceList;
          let provinceIndex = 0;
          let province = provinceList[provinceIndex];
          province.children = children;
          this.$set(provinceList, provinceIndex, province);
        }
      }
    },
    onRegionCascaderFinish({selectedOptions}) {
      if (this.regionPopupType == 'birth') {
        this.member.birth_city_str = selectedOptions[0].text + '-' + selectedOptions[1].text;
        this.member.birth_province = selectedOptions[0].value;
        this.member.birth_city = selectedOptions[1].value;
      } else {
        this.member.live_city_str = selectedOptions[0].text + '-' + selectedOptions[1].text;
        this.member.live_province = selectedOptions[0].value;
        this.member.live_city = selectedOptions[1].value;
      }
      this.showRegionPopup = false;
      this.saveMemberProfile();
    },
    onShowRegionPopup(type) {
      this.regionPopupType = type;
      this.showRegionPopup = true;
    },
    getConstants() {
      const that = this;
      const url = memberConstantsUri;
      this.$http.get(url).then(response => {
        let {code, msg, data} = response.body
        if (code != 0) {
          Toast.fail(msg);
        } else {
          let genderActions = [];
          for (let key in data.genders) {
            genderActions.push({
              name: data.genders[key],
              value: key
            })
          }
          that.genderActions = genderActions;

          let marriageStatusActions = [];
          for (let key in data.marriage_status) {
            marriageStatusActions.push({
              name: data.marriage_status[key],
              value: key
            })
          }
          that.marriageStatusActions = marriageStatusActions;

          let heightActions = [];
          for (let i = 130; i < 220; i++) {
            heightActions.push({
              name: i + 'CM',
              value: i
            })
          }
          that.heightActions = heightActions;

          let weightActions = [];
          for (let i = 35; i < 120; i++) {
            weightActions.push({
              name: i + 'KG',
              value: i
            })
          }
          that.weightActions = weightActions;

          let educationTypesActions = [];
          for (let key in data.education_types) {
            educationTypesActions.push({
              name: data.education_types[key],
              value: key
            })
          }
          that.educationTypesActions = educationTypesActions;

          let jobsActions = [];
          for (let key in data.jobs) {
            jobsActions.push({
              name: data.jobs[key],
              value: key
            })
          }
          that.jobsActions = jobsActions;

          let incomesActions = [];
          for (let key in data.incomes) {
            incomesActions.push({
              name: data.incomes[key],
              value: key
            })
          }
          that.incomesActions = incomesActions;

          let carStatusActions = [];
          for (let key in data.car_status) {
            carStatusActions.push({
              name: data.car_status[key],
              value: key
            })
          }
          that.carStatusActions = carStatusActions;

          let kidsActions = [];
          for (let key in data.kids) {
            kidsActions.push({
              name: data.kids[key],
              value: key
            })
          }
          that.kidsActions = kidsActions;

          let bloodTypesActions = [];
          for (let key in data.blood_types) {
            bloodTypesActions.push({
              name: data.blood_types[key],
              value: key
            })
          }
          that.bloodTypesActions = bloodTypesActions;

          let nationsActions = [];
          for (let key in data.nations) {
            nationsActions.push({
              name: data.nations[key],
              value: key
            })
          }
          that.nationsActions = nationsActions;

          let faithsActions = [];
          for (let key in data.faiths) {
            faithsActions.push({
              name: data.faiths[key],
              value: key
            })
          }
          that.faithsActions = faithsActions;

          let smokesActions = [];
          for (let key in data.smokes) {
            smokesActions.push({
              name: data.smokes[key],
              value: key
            })
          }
          that.smokesActions = smokesActions;

          let drinksActions = [];
          for (let key in data.drinks) {
            drinksActions.push({
              name: data.drinks[key],
              value: key
            })
          }
          that.drinksActions = drinksActions;

          let jobTypesActions = [];
          for (let key in data.job_types) {
            jobTypesActions.push({
              name: data.job_types[key],
              value: key
            })
          }
          that.jobTypesActions = jobTypesActions;

          let distanceRelationshipTypesActions = [];
          for (let key in data.distance_relationship_types) {
            distanceRelationshipTypesActions.push({
              name: data.distance_relationship_types[key],
              value: key
            })
          }
          that.distanceRelationshipTypesActions = distanceRelationshipTypesActions;

          let childTypesActions = [];
          for (let key in data.child_types) {
            childTypesActions.push({
              name: data.child_types[key],
              value: key
            })
          }
          that.childTypesActions = childTypesActions;

          let liveParentsTypesActions = [];
          for (let key in data.live_parents_types) {
            liveParentsTypesActions.push({
              name: data.live_parents_types[key],
              value: key
            })
          }
          that.liveParentsTypesActions = liveParentsTypesActions;
        }
      }, response => {
        // error callback
      })
    },
    saveMemberProfile() {
      if (this.member.gender == 0) {
        Dialog.alert({
          message: '请设置性别',
          theme: 'round-button',
        }).then(() => {
          // on close
        });
        return;
      }
      const that = this;
      that.$http.post(memberSaveBaseInfoUri, this.member, {emulateJSON: true}).then(response => {
        let {msg, code, data} = response.body
        if (code != 0) {
          that.toast.fail(msg)
        } else {
          that.member = data.member;
          that.GLOBAL.memberProfile = data.member;
          that.toast.success('保存成功');
        }
      }, response => {
        that.toast.fail('发生错误');
      })
    },
    saveMemberAvatar(imgUrl, imgId) {
      const that = this;
      const postData = {
        avatar: imgId
      };
      that.$http.post(memberModifyUserAvatarUri, postData, {emulateJSON: true}).then(response => {
        let {msg, code, data} = response.body
        if (code != 0) {
          that.toast.fail(msg)
        } else {
          that.getMyMemberProfile();
          that.toast.success('上传成功，请等待审核');
        }
      }, response => {
        that.toast.fail('发生错误');
      })
    },
    saveMemberNick() {
      if (this.nickForm.nick.length == 0) {
        return;
      }
      const that = this;
      const postData = {
        nick: this.nickForm.nick
      };
      that.$http.post(memberModifyUserNickUri, postData, {emulateJSON: true}).then(response => {
        let {msg, code, data} = response.body
        if (code != 0) {
          that.toast.fail(msg)
        } else {
          that.GLOBAL.userInfo.nick = that.nickForm.nick;
          that.user = that.GLOBAL.userInfo;
          that.toast.success('保存成功');
        }
      }, response => {
        that.toast.fail('发生错误');
      })
    },
    getMyMemberProfile() {
      const that = this;
      that.$http.post(memberMyProfileUri, null, {emulateJSON: true}).then(response => {
        let {msg, code, data} = response.body
        if (code != 0) {
          that.toast.fail(msg)
        } else {
          that.member = data.member;
          that.user = data.user;
        }
      }, response => {
        that.toast.fail('发生错误');
      })
    }
  },
  mounted: function () {
    if (this.GLOBAL.userInfo) {
      this.getMyMemberProfile();
    }

    this.EventBus.$on('OnUserLogined', () => {
      this.getMyMemberProfile();
    });

    this.getConstants();
    this.getRegions(1, (regions) => {
      let provinceList = [];
      provinceList.push({
        text: '不限',
        value: 0,
        children: []
      });
      for (let i = 0; i < regions.length; i++) {
        provinceList.push({
          text: regions[i].region_name,
          value: regions[i].region_id,
          children: []
        })
      }
      this.provinceList = provinceList;
    });
  }
}
</script>

<style scoped>
.user-avatar {
  height: 100px;
  width: 100px;
  border-radius: 50px;
}

.empty-box {
  height: calc(20px + env(safe-area-inset-bottom));
}
</style>
